<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="viewport-fit=cover,width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title>Ionic App</title>
    <base href="./">
    
    <!-- 加载 Ionic CSS -->
    <link href="./ionic/css/chunk-ionic.f5c8e0e3.css" rel="stylesheet">
    <link href="./ionic/css/app.7b141fc5.css" rel="stylesheet">
    
    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }
        
        #loading {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #3880ff;
            color: white;
            font-size: 18px;
        }
        
        #app {
            display: none;
        }
        
        .spinner {
            width: 40px;
            height: 40px;
            border: 4px solid rgba(255,255,255,0.3);
            border-top: 4px solid white;
            border-radius: 50%;
            animation: spin 1s linear infinite;
            margin-right: 15px;
        }
        
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
    </style>
</head>
<body>
    <div id="loading">
        <div class="spinner"></div>
        <span>正在加载 Ionic 应用...</span>
    </div>
    
    <div id="app"></div>
    
    <script>
        console.log('Ionic loader started');
        
        // 检查必要的 API
        if (typeof Promise === 'undefined') {
            console.error('Promise not supported');
            document.getElementById('loading').innerHTML = '<div style="color: red;">浏览器不支持 Promise API</div>';
        }
        
        // 逐步加载 JavaScript 文件
        function loadScript(src, callback) {
            console.log('Loading script:', src);
            const script = document.createElement('script');
            script.src = src;
            script.onload = () => {
                console.log('Script loaded:', src);
                if (callback) callback();
            };
            script.onerror = (error) => {
                console.error('Script failed to load:', src, error);
                document.getElementById('loading').innerHTML = 
                    '<div style="color: red;">加载失败: ' + src + '</div>';
            };
            document.head.appendChild(script);
        }
        
        // 尝试加载传统版本的 JavaScript（非模块版本）
        function loadLegacyScripts() {
            console.log('Loading legacy scripts...');
            
            loadScript('./ionic/js/chunk-ionic-legacy.b2c76632.js', () => {
                loadScript('./ionic/js/chunk-vendors-legacy.30a74f52.js', () => {
                    loadScript('./ionic/js/app-legacy.55c5c7f4.js', () => {
                        console.log('All legacy scripts loaded');
                        
                        // 等待应用初始化
                        setTimeout(() => {
                            const appElement = document.getElementById('app');
                            if (appElement && appElement.innerHTML.trim() !== '') {
                                document.getElementById('loading').style.display = 'none';
                                document.getElementById('app').style.display = 'block';
                                console.log('Ionic app initialized');
                            } else {
                                console.log('App element still empty, trying modern scripts...');
                                loadModernScripts();
                            }
                        }, 2000);
                    });
                });
            });
        }
        
        // 尝试加载现代版本的 JavaScript（ES6 模块）
        function loadModernScripts() {
            console.log('Loading modern scripts...');
            
            const script1 = document.createElement('script');
            script1.type = 'module';
            script1.src = './ionic/js/chunk-ionic.b2c76632.js';
            script1.onload = () => {
                console.log('Modern script 1 loaded');
                
                const script2 = document.createElement('script');
                script2.type = 'module';
                script2.src = './ionic/js/chunk-vendors.9a24fe1a.js';
                script2.onload = () => {
                    console.log('Modern script 2 loaded');
                    
                    const script3 = document.createElement('script');
                    script3.type = 'module';
                    script3.src = './ionic/js/app.39054f79.js';
                    script3.onload = () => {
                        console.log('Modern script 3 loaded');
                        
                        setTimeout(() => {
                            const appElement = document.getElementById('app');
                            if (appElement && appElement.innerHTML.trim() !== '') {
                                document.getElementById('loading').style.display = 'none';
                                document.getElementById('app').style.display = 'block';
                                console.log('Ionic app initialized with modern scripts');
                            } else {
                                document.getElementById('loading').innerHTML = 
                                    '<div style="color: orange;">应用加载完成但未初始化</div>';
                            }
                        }, 3000);
                    };
                    script3.onerror = () => {
                        console.error('Failed to load app.js');
                        document.getElementById('loading').innerHTML = 
                            '<div style="color: red;">应用脚本加载失败</div>';
                    };
                    document.head.appendChild(script3);
                };
                document.head.appendChild(script2);
            };
            document.head.appendChild(script1);
        }
        
        // 开始加载（优先尝试传统版本，因为兼容性更好）
        setTimeout(() => {
            loadLegacyScripts();
        }, 1000);
    </script>
</body>
</html>